import { Button, Card, Modal } from 'antd';

import React, { PureComponent } from 'react';
import DescriptionList from '../../../components/DescriptionList';
const { Description } = DescriptionList;

export default class VehicleDetailModal extends PureComponent {
  render() {
    const { detailModelData, changeAddModalVisible } = this.props;

    return (
      <Modal
        title="详细信息"
        style={{ top: 20 }}
        width="700px"
        onCancel={() => changeAddModalVisible(false)}
        visible={true}
        footer={[
          <Button key="back" type="primary" onClick={() => changeAddModalVisible(false)}>
            返回
          </Button>,
        ]}
      >
        <div>
          <Card bordered={false} type="inner">
            <DescriptionList title="" col={2}>
              <Description term="VIN号" style={{ width: '50%' }}>
                {detailModelData.vin}
              </Description>
              <Description term="品牌" style={{ width: '50%' }}>
                {detailModelData.brandName}
              </Description>
              <Description term="车系" style={{ width: '50%' }}>
                {detailModelData.seriesName}
              </Description>
              <Description term="车型" style={{ width: '50%' }}>
                {detailModelData.styleName}
              </Description>
              <Description term="颜色" style={{ width: '50%' }}>
                {detailModelData.colorName}
              </Description>
              <Description term="车牌" style={{ width: '50%' }}>
                {detailModelData.licence}
              </Description>
              <Description term="经销商" style={{ width: '50%' }}>
                {detailModelData.dealerName}
              </Description>
              <Description term="发动机号" style={{ width: '50%' }}>
                {detailModelData.doptCode}
              </Description>
              <Description term="入库时间" style={{ width: '50%' }}>
                {detailModelData.dealerInDate}
              </Description>
              <Description term="销售时间" style={{ width: '50%' }}>
                {detailModelData.availableDate}
              </Description>
              <Description term="激活时间" style={{ width: '50%' }}>
                {detailModelData.enrollDate}
              </Description>
            </DescriptionList>
          </Card>
        </div>
      </Modal>
    );
  }
}
